<template>
	<template-tab v-if="dataList?true:false" :dataList="dataList" :parameter="parameter" @changeTab="changeTab"
		:able="false">
	</template-tab>
</template>

<script>
	import {
		configMixin
	} from './configMixin.js';
	import templateTab from '@/pagecomponents/templateTab/index.vue'
	export default {
		mixins: [configMixin],
		components: {
			'template-tab': templateTab
		},
		data() {
			return {
				tabAct: 0
			};
		},
		methods: {
			changeTab(obj) {
				let {
					item,
				} = obj
				if (item.value) {
					let url = `/package/product/prodSearch/productSearch?id=${item.value}`;
					if (item.level) {
						url += `&level=${item.level}`;
					}
					if (item.title) {
						url += `&title=${item.title}`;
					}
					this.$linkTo(url);
				}
			}
		}
	};
</script>

<style scoped lang="scss">
	.sww-tab-list {
		white-space: nowrap;
		padding: 0 28rpx 12rpx;
		overflow: visible;

		.sww-tab-item {
			overflow: visible;
			display: inline-block;
			margin-right: 40rpx;
			padding: 6rpx 0 10rpx;

			.sww-tab-item-inset {
				overflow: visible;
				position: relative;
				font-size: 28rpx;
				color: var(--tab_color);
				font-weight: 500;
				font-family: PingFang SC;

				&::before {
					content: '';
					width: 0;
					height: 6rpx;
					background-color: var(--tab_color);
					position: absolute;
					left: 50%;
					bottom: -10rpx;
					transform: translate(-50%, 0);
					border-radius: 3px;
					transition: width 0.3s;
				}

				&.sww-tab-act {
					overflow: visible;
					color: var(--font_color);
					font-weight: bold;
					font-size: 30rpx;

					&::before {
						background-color: var(--font_color);
						width: 60rpx;
					}
				}
			}
		}
	}
</style>
